html {
  .Box-header {
    line-height: 1.2;
    background-color: var(--color-base-950);
    padding: 1rem;
    font-size: calc(var(--font-body-size) * 0.825);
    border: 1px solid var(--theme-elevation-50);
  }

  .Box-body {
    line-height: 1.25;
    max-height: 250px;
    overflow: auto;
    padding: 1rem;
    background-color: var(--color-base-950);
    border: 1px solid var(--theme-elevation-50);
    font-family: var(--font-geist-mono);
    font-size: calc(var(--font-body-size) * 0.825);
  }

  .blob-num::before {
    content: attr(data-line-number);
    padding-right: 10px;
    font-size: 14px;
    color: var(--theme-elevation-600);
  }

  .blob-code-inner {
    white-space: pre-wrap;
  }

  &[data-theme='light'] {
    .Box-header {
      background-color: var(--theme-elevation-50);
    }

    .highlight {
      & pre {
        background-color: var(--color-base-950);
        color: var(--theme-elevation-100);
      }
    }
  }

  &[data-theme='dark'],
  &[data-theme='light'] {
    /*!
    * GitHub Dark v0.5.0
    * Copyright (c) 2012 - 2017 GitHub, Inc.
    * Licensed under MIT (https://github.com/primer/github-syntax-theme-generator/blob/master/LICENSE)
    */

    .pl-c

    /* comment, punctuation.definition.comment, string.comment */ {
      color: #959da5;
    }

    .pl-c1
    /* constant, entity.name.constant, variable.other.constant, variable.language, support, meta.property-name, support.constant, support.variable, meta.module-reference, markup.quote, markup.raw, meta.diff.header */
    ,
    .pl-s .pl-v

    /* string variable */ {
      color: var(--color-blue-200);
    }

    .pl-e
    /* entity */
    ,
    .pl-en

    /* entity.name */ {
      color: var(--color-warning-500);
    }

    .pl-smi
    /* variable.parameter.function, storage.modifier.package, storage.modifier.import, storage.type.java, variable.other */
    ,
    .pl-s .pl-s1

    /* string source */ {
      color: var(--theme-success-450);
    }

    .pl-ent

    /* entity.name.tag */ {
      color: #7bcc72;
    }

    .pl-k

    /* keyword, storage, storage.type */ {
      color: var(--theme-success-450);
    }

    .pl-s
    /* string */
    ,
    .pl-pds
    /* punctuation.definition.string, source.regexp, string.regexp.character-class */
    ,
    .pl-s .pl-pse .pl-s1
    /* string punctuation.section.embedded source */
    ,
    .pl-sr
    /* string.regexp */
    ,
    .pl-sr .pl-cce
    /* string.regexp constant.character.escape */
    ,
    .pl-sr .pl-sre
    /* string.regexp source.ruby.embedded */
    ,
    .pl-sr .pl-sra

    /* string.regexp string.regexp.arbitrary-repitition */ {
      color: var(--color-blue-200);
    }

    .pl-v
    /* variable */
    ,
    .pl-ml

    /* markup.list, sublimelinter.mark.warning */ {
      color: #fb8532;
    }

    .pl-bu

    /* invalid.broken, invalid.deprecated, invalid.unimplemented, message.error, brackethighlighter.unmatched, sublimelinter.mark.error */ {
      color: #d73a49;
    }

    .pl-ii

    /* invalid.illegal */ {
      color: #fafbfc;
      background-color: #d73a49;
    }

    .pl-c2

    /* carriage-return */ {
      color: #fafbfc;
      background-color: #d73a49;
    }

    .pl-c2::before

    /* carriage-return */ {
      content: '^M';
    }

    .pl-sr .pl-cce

    /* string.regexp constant.character.escape */ {
      font-weight: bold;
      color: #7bcc72;
    }

    .pl-mh
    /* markup.heading */
    ,
    .pl-mh .pl-en
    /* markup.heading entity.name */
    ,
    .pl-ms

    /* meta.separator */ {
      font-weight: bold;
      color: #0366d6;
    }

    .pl-mi

    /* markup.italic */ {
      font-style: italic;
      color: #f6f8fa;
    }

    .pl-mb

    /* markup.bold */ {
      font-weight: bold;
      color: #f6f8fa;
    }

    .pl-md

    /* markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted */ {
      color: #b31d28;
      background-color: #ffeef0;
    }

    .pl-mi1

    /* markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted */ {
      color: #176f2c;
      background-color: #f0fff4;
    }

    .pl-mc

    /* markup.changed, punctuation.definition.changed */ {
      color: #b08800;
      background-color: #fffdef;
    }

    .pl-mi2

    /* markup.ignored, markup.untracked */ {
      color: #2f363d;
      background-color: #959da5;
    }

    .pl-mdr

    /* meta.diff.range */ {
      font-weight: bold;
      color: #b392f0;
    }

    .pl-mo

    /* meta.output */ {
      color: #0366d6;
    }

    .pl-ba

    /* brackethighlighter.tag, brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle, brackethighlighter.quote */ {
      color: #ffeef0;
    }

    .pl-sg

    /* sublimelinter.gutter-mark */ {
      color: #6a737d;
    }

    .pl-corl

    /* constant.other.reference.link, string.other.link */ {
      text-decoration: underline;
      color: var(--color-blue-200);
    }

    .pl-s1 {
      color: var(--color-base-50);
    }
  }
}
